<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>

<head>
	<base href="/">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    

    <title>后台 - 注册</title>
    <meta name="keywords" content="后台 - 注册">
    <meta name="description" content="后台 - 注册">

    <link rel="shortcut icon" href="favicon.ico"> <link href="static/templet/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="static/templet/css/bootstrap.min.css" rel="stylesheet">
    <link href="static/templet/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">

    <link href="static/templet/css/animate.min.css" rel="stylesheet">

    <link href="static/templet/css/login.min.css" rel="stylesheet">
    <link href="static/templet/css/base.css" rel="stylesheet">
    <link href="static/templet/css/style.min.css?v=4.0.0" rel="stylesheet"><base target="_blank">
    <!--[if lt IE 8]>
    <meta http-equiv="refresh" content="0;ie.html" />
    <![endif]-->
    <script>if(window.top !== window.self){ window.top.location = window.location;}</script>
</head>

    
    <body class="signin">
    <div class="signinpanel">
            <div class="col-sm-12">
            
            <div class="middle-box" style="padding: 0">
            
                <form method="post" class="m-t" role="form" action="index.html">
                	<h2 class="no-margins text-white"><strong>欢迎注册</strong></h2>
                    <div class="form-group">
                    <input type="text" id="userName" class="h50 lh50 form-control uname" placeholder="请设置用户名" />
                    </div>
                    <div class="form-group">
                    <input type="password" id="password" class="h50 lh50 form-control pword m-b-none" placeholder="设置你的登录密码" />
                    </div>
                    <div class="form-group">
                    <input type="password" id="againPassword" class="h50 lh50 form-control pword m-b-none" placeholder="请再次确认你的密码" />
                    </div>
                    <div class="form-group">
                    <input type="text" id="phone" class="h50 lh50 form-control m-b-none" placeholder="请输入手机号码" />
                    </div>
                    <div class="form-group">
                         <div class="input-group">
                         	<input type="text" id="smsCode" name="smsCode" value="" class="h50 lh50 form-control m-b-none">
                         	<span class="input-group-btn">
                         		<button type="button" id="sendButton" class="btn btn-success btn-lg" onclick="sendSms();">发送验证码</button>
                         	</span>
                         </div>
					</div>
                    <button type="button" id="registerBtn" class="btn btn-success btn-block btn-lg">确认并注册</button>
                    
                </form>
                </div>
            </div>
        </div>
    </div>
</body>
    
    <script src="static/templet/js/jquery.min.js?v=2.1.4"></script>
    <script src="static/templet/js/bootstrap.min.js?v=3.3.5"></script>
    <script src="static/templet/js/plugins/layer/layer.min.js"></script>
    <script type="text/javascript">
    var sInviteCode = '${param.sInviteCode}';
    $(document).ready(function() {
		
		$("#registerBtn").on("click", function() {
			var load = layer.load(1, {
		        shade: [0.1,'#fff']
		    });
			var params = {};
			if($.trim($("#userName").val()) == ''){
				layer.msg('请设置用户名', {icon: 1});
				layer.close(load);
				return;
			}
		    params.userName = $.trim($("#userName").val());
			var password = $.trim($("#password").val());
			
			if(password == ''){
				layer.msg('请设置登录密码', {icon: 1});
				layer.close(load);
				return;
			}
			params.password = password;
			var againPassword = $.trim($("#againPassword").val());

			if(againPassword == ''){
				layer.msg('请再次确认登录密码', {icon: 1});
				layer.close(load);
				return;
			}

			if(password != againPassword){
				layer.msg('两次密码输入不一致', {icon: 1});
				layer.close(load);
				return;
			}
			params.againPassword = againPassword;
			if($.trim($("#phone").val()) == ''){
				layer.msg('请输入手机号', {icon: 1});
				layer.close(load);
				return;
			}
			params.phone = $.trim($("#phone").val());
			if($.trim($("#smsCode").val()) == ''){
				layer.msg('请输入验证码', {icon: 1});
				layer.close(load);
				return;
			}
			params.smsCode = $.trim($("#smsCode").val());
			params.sInviteCode = sInviteCode;
			
			$.post('register/to',params, function(data, status){
				layer.close(load);
				if(status == 'success'){
					var result = data.result;
					var state = result.state;
					console.log(result)
					if(state == 1){
						layer.msg('注册成功', {icon: 1});
						location.href = '/';
					}else{
						layer.msg(result.message, {icon: 1});
					}
				}
			})
			
		});
		
		$(document).keyup(function(event) {
			if (event.keyCode == 13) {
				$("#registerBtn").trigger("click");
			}
		});
    });
    </script>
    
	<script type="text/javascript">
	function timer(btn,time) {

		
		var hander = setInterval(function() { 
		if (time <= 0) { 
			clearInterval(hander); //清除倒计时 
			btn.text("发送验证码"); 
			btn.attr("disabled", false); 
			return false; 
		}else { 
			btn.text("" + (time--) + "秒后可发送"); 
		} 
		}, 1000); 
		

	}

	function sendSms(){
		var btn = $("#sendButton"); 
		btn.attr("disabled", true); //按钮禁止点击
		var phone = $("#phone").val();
		
		if($.trim($("#phone").val()) == ''){
			layer.msg('请输入手机号', {icon: 1});
			btn.attr("disabled", false);
			return;
		}
		
		$.post('register/sendSms',{phone:phone}, function(data, status){
			if(status == 'success'){
				var result = data.result;
				var state = result.state;
				if(state == 1){
					timer(btn,60);
				}else{
					layer.msg(result.message, {icon: 1});
					btn.attr("disabled", false);
					return;
				}
			}else{
				btn.attr("disabled", false);
				return;
			}
		})
	}

</script>

</html>